<?php
if (is_array($data)) {
    echo '<pre>';
    print_r($data);
    echo '<pre>';
}

?>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>

<div class="container">
    <!-- start: Page Title Icon-->
    <div id="page-title-icon"></div>
    <div id="page-title-icon-inner">
        <i class="ico-google-maps ico-white"></i>
    </div>
    <!-- end: Page Title Icon-->
    <!-- start: Page Title -->
    <section id="page-title">
        <h2><span>Đăng Tin</span></h2>
    </section>
</div>
<div id="wrapper" class="white-wrapper">

    <!-- start: Container -->
    <div class="container">

        <div class="sixteen columns">
            <h3> Đăng Tin Rao Vặt </h3>

            <form id="dangtin" method="post"
                  action="<?php echo $this->url('register', array('action' => 'addtopic')) ?>">
                <div id="step1">
                    <div class="field">
                        <div class="field_title"> <strong>Danh Mục: <span>*</span></strong></div>
                        <?php
                        $cat = array();
                        $cat = Velacolib\Utility\Utility::getTopicCat()->getAll();
                        ?>
                        <select name="cat_id">
                            <?php
                            foreach ($cat as $c) {
                                ?>
                                <option value="<?php echo $c->id ?>"><?php echo $c->title; ?></option>
                            <?php
                            }
                            ?>
                        </select>
                    </div>

                    <div class="field">
                        <div class="field_title"> <strong>Tên Sản Phẩm: <span>*</span></strong> </div>
                        <input type="text" name="title" class="text" required="required">
                    </div>

                    <div class="field">
                    </div>

                    <div class="field">
                        <div class="field_title"> <strong>Hình ảnh</strong>   </div>
                        <input type="hidden" id="images_thumb" name="images" class="text" value="">
                        <img  src="" id="images">
                        <div style="width: 200px;float: left"> <input  id="file_upload" name="file_upload" type="file" multiple="true">
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="sixteen column" style="width: 100%;float: left;clear: both">
                        <div class="flickr-widget" id="img_content" style="">
                        </div>
                    </div>
                    <div class="field">
                        <div class="field_title"> <strong> Tình trạng: </strong></div>
                        <span>Mới</span> <input type="radio" checked class="radio" name="is_brandnew" value="1"/>
                        <span>Cũ</span> <input type="radio" class="radio" name="is_brandnew" value="0">
                    </div>
                    <div class="clear"></div>
                    <div class="field">
                        <div class="field_title"> <strong>Hiện Giá : <span>*</span></strong> </div>
                        <select name="show_price">
                            <option value="1">Hiện</option>
                            <option value="0">Ẩn</option>
                        </select>
                    </div>
                    <div class="clearfix"></div>
                    <div class="field" style="margin-top: 10px;">
                        <div class="field_title"> <strong>Giá: <span>*</span></strong></div>
                        <input type="text" required="required" name="price" id="format_price" class="text" value="">
                    </div>
                    <script>
                        $(function () {
                            $('#format_price').blur(function () {
                                $('#format_price').html(null);
                                $(this).formatCurrency({
                                    colorize: true,
                                    negativeFormat: '-%s%n',
                                    roundToDecimalPlace: 0,
                                    symbol: ''
                                });
                            })
                                .keyup(function (e) {
                                    var e = window.event || e;
                                    var keyUnicode = e.charCode || e.keyCode;
                                    if (e !== undefined) {
                                        switch (keyUnicode) {
                                            case 16:
                                                break; // Shift
                                            case 17:
                                                break; // Ctrl
                                            case 18:
                                                break; // Alt
                                            case 27:
                                                this.value = '';
                                                break; // Esc: clear entry
                                            case 35:
                                                break; // End
                                            case 36:
                                                break; // Home
                                            case 37:
                                                break; // cursor left
                                            case 38:
                                                break; // cursor up
                                            case 39:
                                                break; // cursor right
                                            case 40:
                                                break; // cursor down
                                            case 78:
                                                break; // N (Opera 9.63+ maps the "." from the number key section to the "N" key too!) (See: http://unixpapa.com/js/key.html search for ". Del")
                                            case 110:
                                                break; // . number block (Opera 9.63+ maps the "." from the number block to the "N" key (78) !!!)
                                            case 190:
                                                break; // .
                                            default:
                                                $(this).formatCurrency({ colorize: true, negativeFormat: '-%s%n', roundToDecimalPlace: -1, eventOnDecimalsEntered: true });
                                        }
                                    }
                                })

                        });


                    </script>


                    <div class="field">
                        <div class="field_title"> <strong>Ngày Hết Hạn: <span>*</span></strong> </div>
                        <input type="text" required="required" name="expire_date" id="expire_date" class="text "
                               value="">
                    </div>


                    <div class="field">
                        <div class="field_title"> <strong>Cần Bán/ Mua : <span>*</span></strong></div>

                        <?php

                        $product_type = array();
                        $product_type = Velacolib\Utility\Utility::getProductType();
                        ?>

                        <?php
                        foreach ($product_type as $key => $p) {

                            echo '<span>' . $p . '</span>';
                            ?>
                            <input checked type="radio" class="radio" name="topic_type" value="<?php echo $key ?>">
                        <?php
                        }
                        ?>
                         </div>
                    <div class="clear"></div>

                        <div class="field">
                            <div class="field_title"> <strong>Địa Điểm: <span>*</span></strong></div>
                            <?php
                            $product_loc = array();
                            $product_loc = Velacolib\Utility\Utility::getLocationArray();
                            ?>
                            <select name="topic_location">

                                <?php
                                foreach ($product_loc as $key => $l) {
                                    ?>
                                    <option value="<?php echo $key ?>"><?php echo $l; ?></option>
                                <?php
                                }
                                ?>
                            </select>
                        </div>


                        <div class="field">
                            <label>Tóm Tắt: <span>*</span></label>
                            <textarea required="required" name="short_description" class="text textarea"></textarea>
                        </div>

                        <div class="field">
                            <label>Chú Thích Sản Phẩm: <span>*</span></label>
                            <textarea required="required" name="full_description" class="text textarea"></textarea>
                        </div>

                        <div class="field">
                            <input type="submit" id="cont" value="Tiếp tục">

                            <div class="loading"></div>
                        </div>
                    </div>
                </div>

            </form>

        </div>
    </div>
</div>
</div>
<script>
    $(document).ready(function () {
        $("#dangtin").validate();
        $('.chosen-select').chosen();
        $('#file_upload').uploadify({
            'auto': true,
            'swf': '/templates/front/js/uploadify/uploadify.swf',
            'uploader': '<?php echo $this->url('frontendtopic',array('action'=>'addtopicimg')) ?>',
            // 'formData'      : {'topic_id' : topic_id},
            'onUploadSuccess': function (file, data, response) {
                $('#images_thumb').val(data);
                $('#images').attr('src', data);
                var content = '<div class="flickr_badge_image_upload two columns"><input type="hidden" name="gel[]" value="' + data + '"> <img src="' + data + '" ><input type="button" class="btn_set_thumbnail" thumb="' + data + '" value="Chọn ảnh đại diện"><input type="button" class="btn_delete_img" value="Xóa"> </div>';
                $('#img_content').append(content);
            }
        });

        $('#expire_date').datepicker({ dateFormat: 'yy-mm-dd' }).val();

        var src = $("#images").attr("src");
        if (src != null) $("#images").css("width", "100");
    })

    $(document).on('click', '.btn_set_thumbnail', function () {
        var str = $(this).attr('thumb');
        $('#images').attr('src', str);
        $('#images_thumb').val(str);

    });
    $(document).on('click', '.btn_delete_img', function () {
        $(this).parent('.flickr_badge_image_upload').remove();
    });


</script>

<style>
    .swfupload {
        height: 35px !important;
    }
</style>
